import React, { Component } from "react";
import { List, Segmented, Space, Divider } from "antd";
import axios from "axios";
import FileListPage from "./unit/FileListPage";
import { AppstoreOutlined, BarsOutlined } from '@ant-design/icons'

const data = [
  {
    fileName: "Title 1",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
  {
    fileName: "Title 2",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
  {
    fileName: "Title 3",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
  {
    fileName: "Title 4",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
  {
    fileName: "Title 5",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
  {
    fileName: "Title 6",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
  {
    fileName: "Title 6",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
  {
    fileName: "Title 6",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
  {
    fileName: "Title 6",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
  {
    fileName: "Title 6",
    url: "https://open.saintic.com/api/bingPic/",
    createDt: "2023-03-18 13:00:18"
  },
];

export default class Warehouse extends Component {
  componentDidMount = () => {
    console.log("初始化");
  };

  state = {
    cardMode: false
  }

  changeMode = (param) => {
    this.setState({
      cardMode: param === 'List'
    })
  }

  render() {

    return (
      <div>
        <div>
          <Space wrap>
            <Segmented options={['Daily', 'Weekly', 'Monthly', 'Quarterly', 'Yearly']} />
            <Segmented options={[
              {
                value: 'Kanban',
                icon: <BarsOutlined />,
              }, {
                value: 'List',
                icon: <AppstoreOutlined />,
              }]} onChange={this.changeMode} />
          </Space>
        </div>
        <Divider>💕</Divider>
        <FileListPage cardMode={this.state.cardMode} fileInfos={data} />
      </div>
    );
  }
}
